<!-- 报价商机 -->
<template>
	<view>
		<u-navbar :isFixed="true" title="报价商机" :borderBottom="false"></u-navbar>
		<go-top :scrollTop="scrollTop"></go-top>
		<view class="tabs">
			<u-tabs :list="tabs" :is-scroll="false" :current="order_type" @change="chooseTab" bg-color="#F8F8F8"
				active-color="#38BE8C" bar-width="60"></u-tabs>
		</view>
		<view class="block" v-if="list.length>0"></view>
		<block v-for="(item,index) in list">
			<view class="card">
				<view class="flex_bet">
					<view class="title">{{item.getdemand.titles}}</view>
					<view class="time">{{item.createtime}}</view>
				</view>
				<view class="msg">采购数量：{{item.getdemand.number}}{{item.getdemand.unit}}</view>
				<view class="msg clamp1">求购规格：{{item.getdemand.spec}}</view>
				<view class="msg">求购地区：{{item.getdemand.city}}</view>
				<view class="bot flex_bet_align" v-show="order_type != 0">
					<view class="price"><text v-show="order_type==1">￥{{item.money}}/{{item.getdemand.unit}}【{{item.type==1?'上车价':'到货价'}}】</text></view>
					<view class="flex">
						<view class="chat" @click="chat(item)">聊一聊</view>
						<view class="del" v-show="order_type==2" @click="deleteTunity(item.id)">删除</view>
						<view class="del" v-show="order_type==1" @click="opemedit">编辑</view>
					</view>
				</view>
				<view class="btnGroup flex" v-show="order_type==0">
					<view class="btn" @click="offer(item.getdemand.id)">立即报价</view>
					<view class="btn" @click="noOffer(item.id)">不报价</view>
				</view>
			</view>
			<view class="block"></view>

			<u-popup v-model="show" mode="center" border-radius="14" @close="quxiao">
				<view class="popup_title">价格修改</view>
				<view class="flex_align popup_input" style="border: none;">
					{{'当前价格 ￥ '+item.money}}
				</view>
				<view class="flex_align popup_input">
					<input type="text" v-model="editnum" @confirm='chang_money' placeholder="￥请输入修改的价格" />
				</view>
				<view class="flex_align popup_foot">
					<view class="popup_sub" @click="quxiao">
						取消
					</view>
					<view class="popup_sub green" @click="editTunity(item.id)">
						确认
					</view>
				</view>
			</u-popup>
		</block>
		<view class="not_more" v-if="list.length<1">
			<image src="../static/img/wdingdan.png" mode="widthFix"></image>
			<view class="text">暂无报价</view>
		</view>
		<view class="nomore" v-if="nomore&&list.length>0">—— · 没有更多了 · ——</view>
		<view style="height:130rpx;" v-if="order_type==2&&list.length>0"></view>
		<view class="foot" v-if="order_type==2&&list.length>0">
			<view @click="deleteall">一键清空</view>
		</view>
	</view>
</template>

<script>
	var _this, $paginator,shak;
	export default {
		data() {
			return {
				tabs:[
					{name:'待报价'},
					{name:'已报价'},
					{name:'已错过'}
				],
				order_type: 0,
				list: [],
				nomore: false,
				// 回到头部按钮距离
				scrollTop: 0,

				show: false,
				editnum: ""
			}
		},
		onLoad() {
			_this = this
			$paginator = new _this.$paginator(_this.$api)
			_this.getdata(true)
		},
		//监听页面滚动
		onPageScroll(res) {
			this.scrollTop = res.scrollTop
		},
		//下拉刷新
		onPullDownRefresh() {
			$paginator = new _this.$paginator(_this.$api)
			_this.getdata(true)
		},
		onReachBottom: function() {
			$paginator.nextPager(() => {
				_this.getdata()
			})
		},
		methods: {
			getdata: function(firstLoad = false) {
				$paginator.getData('demandboppty', {demand_status: parseInt(_this.order_type)+1}, (data) => {
					if (firstLoad) {
						_this.list = data.list ? data.list : []
					} else {
						_this.list = _this.list.concat(data.list)
					}
					_this.nomore = data.nomore
				})
			},
			chooseTab(e){
				_this.order_type=e
				_this.list=[]
				$paginator = new _this.$paginator(_this.$api)
				_this.getdata(true)
			},
			// 立即报价
			offer(id){
				uni.navigateTo({
					url:"home/index/wanted?id="+id
				})
			},
			// 不报价
			noOffer(id){
				_this.click_shake(()=>{
					_this.$api.get("nooffer",{id:id}).then(data => {
						$paginator = new _this.$paginator(_this.$api)
						_this.getdata(true)
					});
				})
			},

			opemedit() {
				_this.show = true
				_this.editnum = ''
			},

			//编辑价格
			editTunity(id) {
				_this.click_shake(() => {
					_this.$api.post("edit_quote", {
						d_id: id,
						price: _this.editnum
					}).then(data => {
						uni.showToast({
							title: '修改成功',
							icon: 'success',
							duration: 2000,
							success: function() {
								setTimeout(function() {
									_this.show = false
									$paginator = new _this.$paginator(_this.$api)
									_this.getdata(true)
								}, 500);
							}
						})

					});
				})
			},
			quxiao() {
				_this.show = false
			},

			// 删除
			deleteTunity(id){
				wx.showModal({
				  content: '确认删除？',
				  success (res) {
				    if (res.confirm) {
						_this.$api.get("deloffer",{id:id}).then(data => {
							$paginator = new _this.$paginator(_this.$api)
							_this.getdata(true)
						});
					  }
				  }
				})
			},
			// 一键删除
			deleteall(){
				wx.showModal({
				  content: '确认清空全部？',
				  success (res) {
				    if (res.confirm) {
						_this.$api.get("demandclear",{}).then(data => {
							$paginator = new _this.$paginator(_this.$api)
							_this.getdata(true)
						});
					  }
				  }
				})
			},
			// 防抖点击
			click_shake(fn){
				if(!_this.shake){
					fn && typeof fn === 'function' && fn()
					_this.shake=true
					setTimeout(function(){
						_this.shake=false
					},500)
				}
			},
			
			// 跳转到聊天
			chat(item) {
				item.getdemand.name = item.getdemand.name
				console.log(item.getdemand)
				wx.setStorageSync('list', item.getdemand)
				uni.navigateTo({
					url: '../chat/chatingroom?type=4'+ '&member_type=1'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page{
		font-family: PingFang SC;
	}
	.block{
		height: 15rpx;
		background-color: #F2F2F2;
	}
	.tabbar{
		padding-top:20rpx;
		justify-content: space-around;
		font-size: 30rpx;
		text-align: center;
		color: #333333;
		.line{
			width: 40rpx;
			height: 5rpx;
			margin:18rpx auto;
			background: #38be8c;
			border-radius: 3rpx;
		}
	}
	.card{
		padding:47rpx 56rpx 49rpx 25rpx;
		.title{
			font-size: 32rpx;
			color: #333333;
			flex: 1;
		}
		.time{
			font-size: 26rpx;
			color: #999999;
		}
		.msg{
			font-size: 26rpx;
			color: #999999;
			margin-top:20rpx;
		}
		.bot{
			margin-top:90rpx;
			.price{
				font-size: 30rpx;
				color: #333333;
			}
			.chat{
				font-size: 30rpx;
				font-weight: 400;
				color: #38be8c;
			}
			.del{
				font-size: 30rpx;
				font-weight: 400;
				color: #999999;
				margin-left: 66rpx;
			}
		}
		.btnGroup{
			margin-top:65rpx;
			flex-direction: row-reverse;
			.btn{
				width: 180rpx;
				height: 66rpx;
				border: 1rpx solid #666666;
				border-radius: 34rpx;
				font-size: 30rpx;
				font-weight: 400;
				text-align: center;
				line-height: 66rpx;
				color: #333333;
			}
			.btn:nth-child(1){
				border:1rpx solid #38BE8C;
				color:#38BE8C;
				margin-left:18rpx;
			}
		}
	}
	.foot {
		width: 680rpx;
		height: 90rpx;
		font-size: 34rpx;
		font-weight: 400;
		text-align: center;
		color: #ffffff;
		line-height: 90rpx;
		position: fixed;
		bottom: 37rpx;
		left: 36rpx;
		overflow: hidden;
		border-radius: 45rpx;
		view {
			flex: 1;
			background: linear-gradient(86deg,#38be8c 0%, #05adbb 100%);
		}
	}

	.popup_title {
		text-align: center;
		font-size: 36rpx;
		padding-top: 48rpx;
		margin-bottom: 30rpx;
	}

	.popup_input {
		width: 80%;
		margin: 0 auto;
		border: 1rpx solid #B5B5B5;
		padding: 15rpx 20rpx;
		margin-top: 20rpx;

		input {
			width: 78%;
			font-size: 28rpx;
			margin-left: 20rpx;
		}
	}

	.popup_foot {
		width: 80%;
		margin: 60rpx auto 30rpx;
		justify-content: space-between;
	}

	.popup_sub {
		width: 290rpx;
		height: 88rpx;
		line-height: 88rpx;
		text-align: center;
		background-color: #DCDCDC;
		border-radius: 88rpx;
		font-size: 36rpx;
	}

	.green {
		background-image: linear-gradient(to right, #62BB91, #4EABB6);
		color: #FFFFFF;
		margin-left: 35rpx;
	}
</style>
